/**
 * Created by Administrator on 2016/10/22 0022.
 */
window.onload=function() {
    var oDiv = document.getElementById('gd');
    var oUl = oDiv.getElementsByTagName('ul')[0];//因为没有用id选择器，所以只能用ByTagName，但是需要加一个[0]来指定他是数组的第一个。
    var aLi = oUl.getElementsByTagName('li');
    var aImg=document.getElementsByTagName('img');
    var aA=document.getElementsByTagName('a');
    oUl.innerHTML = oUl.innerHTML + oUl.innerHTML;//把图片复制成8张
    oUl.style.width = aLi[0].offsetWidth * aLi.length + 'px';//让ul的宽度容纳8张图片，也就是拓宽成8张图片的宽度。

    function move() {
        if (oUl.offsetLeft < -oUl.offsetWidth / 2) {
            oUl.style.left = '0';
        }
        oUl.style.left = oUl.offsetLeft - 2 + 'px';
    }

    var timer = setInterval(move, 30);
    oDiv.onmouseover = function () {
        clearInterval(timer);
    };
    oDiv.onmouseout = function () {
        timer = setInterval(move, 30);
    };

    var oDiv1 = document.getElementById('content-bottom');
    var oUl1 = oDiv1.getElementsByTagName('ul')[0];//因为没有用id选择器，所以只能用ByTagName，但是需要加一个[0]来指定他是数组的第一个。
    var aLi1 = oUl1.getElementsByTagName('li');
    var speed=2;

    oUl1.innerHTML = oUl1.innerHTML + oUl1.innerHTML;//把图片复制成8张
    oUl1.style.width = aLi1[0].offsetWidth * aLi1.length + 'px';//让ul的宽度容纳8张图片，也就是拓宽成8张图片的宽度。

    var timer1 = setInterval(move1, 30);
    oDiv1.onmouseover = function () {
        clearInterval(timer1);
    };
    oDiv1.onmouseout = function () {
        timer1 = setInterval(move1, 30);
    };
    document.getElementById('img4').onclick = function () {
        speed = 2;
    };
    document.getElementById('img3').onclick = function () {
        speed = -2;
    };
    function move1() {
        if (oUl1.offsetLeft < -oUl1.offsetWidth / 2) {
            oUl1.style.left = '0';
        }
        if (oUl1.offsetLeft > 0) {
            oUl1.style.left = -oUl1.offsetWidth / 2 + 'px';
        }
        oUl1.style.left = oUl1.offsetLeft + speed + 'px';
    }
    for(var i=0;i<aImg.length;i++)
    {
        aImg[i].title='图片';
        aImg[i].alt="加载失败"
    }
    for(var i=0;i<aA.length;i++)
    {
        aA[i].title=aA[i].innerHTML;
    }
}
window.onscroll=function()
{
    var oDiv=document.getElementById('img5');
    var oDiv1=document.getElementById('img6');
    var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;
    //documnet.documentElement.clientHeight:可视区的高度。scrollTop:可视区顶端和页面顶端的高度
//            oDiv.style.top=(document.documentElement.clientHeight-oDiv.offsetHeight)/2+scrollTop+'px';
    startMove(parseInt((document.documentElement.clientHeight-oDiv.offsetHeight)/2+scrollTop));//parseInt()视为防止它上下抖动
    startMove1(parseInt((document.documentElement.clientHeight-oDiv1.offsetHeight)/2+scrollTop));//parseInt()视为防止它上下抖动
}
var timer=null;

function startMove(iTarget)
{
    var oDiv=document.getElementById('img5');
    clearInterval(timer);
    timer=setInterval(function(){
        var speed=(iTarget-oDiv.offsetTop)/6;
        speed=speed>0?Math.ceil(speed):Math.floor(speed);
        if(oDiv.offsetTop==iTarget)
        {
            clearInterval(timer);
        }
        else
        {
            oDiv.style.top=oDiv.offsetTop+speed+'px';
        }
    },30);
}
var timer1=null;
function startMove1(iTarget)
{
    var oDiv=document.getElementById('img6');
    clearInterval(timer1);
    timer1=setInterval(function(){
        var speed=(iTarget-oDiv.offsetTop)/6;
        speed=speed>0?Math.ceil(speed):Math.floor(speed);
        if(oDiv.offsetTop==iTarget)
        {
            clearInterval(timer1);
        }
        else
        {
            oDiv.style.top=oDiv.offsetTop+speed+'px';
        }
    },30);
}